import { reactive, ref , computed} from "vue";
import { toast } from "~/composables/util.js"
//列表分页搜索
export function useInitTab(opt = {}) {
  let searchForm = null;
  let resetSearchForm = null;
  if (opt.searchForm) {
    searchForm = reactive({ ...opt.searchForm });
    resetSearchForm = () => {
      for (const key in opt.seachForm) {
        searchForm[key] = opt.seachForm[key];
      }
      getData();
    };
  }
  const tableData = ref([]);
  //加载动画
  const loading = ref(false);
  //分页
  const currentPage = ref(1);
  const total = ref(0);
  const limit = ref(10);
  function getData(p = null) {
    if (typeof p == "number") {
      currentPage.value = p;
    }
    loading.value = true;
    opt
      .getList(currentPage.value, searchForm)
      .then((res) => {
        if (opt.onGetListSuccess && typeof opt.onGetListSuccess == "function") {
          opt.onGetListSuccess(res);
        } else {
          tableData.value = res.list;
          total.value = res.totalCount;
        }
      })
      .finally(() => {
        loading.value = false;
      });
  }
  getData();
  //修改状态
const handleStatusChange = (status, row) => {
  row.statusLoading = true;
  opt.updateStatus(row.id, status)
      .then(res => {
          toast("修改成功");
          row.status = status;
      }).finally(() => {
          row.statusLoading = false;
      })
}
  return {
    searchForm,
    resetSearchForm,
    tableData,
    loading,
    currentPage,
    total,
    limit,
    getData,
    handleStatusChange
  };
}
//新增修改
export function useInitForm(opt = {}) {
  //新增
  const formDrawerRef = ref(null);
  const formRef = ref(null);
  const defaultForm = opt.form;
  const form = reactive({});
  const editId = ref(0);
  const drawerTitle = computed(() => (editId.value ? "修改" : "新增"));
  const rules = opt.rules || {};
  
  const handleSubmit = () => {
    formRef.value.validate((valid) => {
      if (!valid) return;
      formDrawerRef.value.showLoading();
      let body = {}
      if(opt.beforeSubmit && typeof opt.beforeSubmit == "function"){
        body = opt.beforeSubmit({...form})
      } else {
        body = form
      }
      let fun = editId.value
        ? opt.edit(editId.value, body)
        : opt.create(body);
      fun
        .then((res) => {
          toast(drawerTitle.value + "成功");
          opt.getData(editId.value ? false : 1);
          formDrawerRef.value.close();
        })
        .finally(() => {
          formDrawerRef.value.hideLoading();
        });
    });
  };
  const handleCreate = () => {
    editId.value = 0;
    resetForm(defaultForm);
    formDrawerRef.value.open();
  };
  //重置表单
  function resetForm(row = false) {
    if (formRef.value) formRef.value.clearValidate();
    for (const key in defaultForm) {
      form[key] = row[key];
    }
  }
  //修改
  const handleEdit = (row) => {
    editId.value = row.id;
    resetForm(row);
    formDrawerRef.value.open();
  };
  //删除
  const handleDelete = (id) => {
    opt.loading.value = true;
    opt.delete(id)
      .then((res) => {
        toast("删除成功");
        opt.getData();
      })
      .finally(() => {
        opt.loading.value = false;
      });
  };

  //多选选中ID
  const multiSelectionIds = ref([])
  const multipleTableRef = ref(null)
  const handleSelectionChange = (e) => {
      multiSelectionIds.value = e.map(o => o.id)
  }
  //批量删除
  const handleMultiDelete = () => {
      opt.loading.value = true;
      opt.delete(multiSelectionIds.value)
          .then(res => {
              toast("删除成功");
              //清空选中
              if(multipleTableRef.value){
                  multipleTableRef.value.clearSelection();
              }
              opt.getData();
          }).finally(() => {
            opt.loading.value = false;
          })
  }
  //批量修改
  const handleMultiStatus = (status) => {
    opt.loading.value = true;
    opt.editStatus(multiSelectionIds.value,status)
        .then(res => {
            toast("修改成功");
            //清空选中
            if(multipleTableRef.value){
                multipleTableRef.value.clearSelection();
            }
            opt.getData();
        }).finally(() => {
          opt.loading.value = false;
        })
}
  return {
    formDrawerRef,
    formRef,
    form,
    editId,
    drawerTitle,
    rules,
    handleSubmit,
    handleCreate,
    resetForm,
    handleEdit,
    handleDelete,
    multipleTableRef,
    handleSelectionChange,
    handleMultiDelete,
    handleMultiStatus,
    multiSelectionIds 
  }
}
